{% block sw_cms_config_product_listing_delete_modal %}
<sw-modal>
    <template #modal-header>
        {% block sw_cms_config_product_listing_delete_modal_header %}
        <h4 class="sw-modal__title">
            {{ $tc('sw-cms.elements.productListing.config.sorting.deleteModal.heading', { productSortingName: productSorting.label } ) }}
        </h4>
        {% endblock %}
    </template>

    {% block sw_cms_config_product_listing_delete_modal_body %}
    <p class="sw-cms-el-config-product-listing-config-delete-modal__body">
        {{ $tc('sw-cms.elements.productListing.config.sorting.deleteModal.body', { productSortingName: productSorting.label } ) }}
    </p>
    {% endblock %}

    <template #modal-footer>
        {% block sw_cms_config_product_listing_delete_modal_footer %}
        {% block sw_cms_config_product_listing_delete_modal_footer_button_cancel %}
        <mt-button
            class="sw-cms-el-config-product-listing-config-delete-modal__cancel"
            size="small"
            variant="secondary"
            @click="onCancel"
        >
            {{ $tc('global.default.cancel') }}
        </mt-button>
        {% endblock %}

        {% block sw_cms_config_product_listing_delete_modal_footer_button_confirm %}
        <mt-button
            class="sw-cms-el-config-product-listing-config-delete-modal__confirm"
            variant="critical"
            size="small"
            @click="onConfirm"
        >
            {{ $tc('global.default.delete') }}
        </mt-button>
        {% endblock %}
        {% endblock %}
    </template>
</sw-modal>
{% endblock %}
